﻿<!DOCTYPE html>
<!--HTML5 doctype-->
<html>

    <head>
        <script>
        (function() {
    if ("-ms-user-select" in document.documentElement.style && navigator.userAgent.match(/IEMobile\/10\.0/)) {
        var msViewportStyle = document.createElement("style");
        msViewportStyle.appendChild(
            document.createTextNode("@-ms-viewport{width:auto!important}")
        );
        document.getElementsByTagName("head")[0].appendChild(msViewportStyle);
    }
})();
</script>
        <title>心愿墙</title>
        <meta http-equiv="Content-type" content="text/html; charset=utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=0">
        <meta name="apple-mobile-web-app-capable" content="yes" />
        <META HTTP-EQUIV="Pragma" CONTENT="no-cache">
        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
        <link rel="stylesheet" type="text/css" href="css/icons.css" />    
 
       <!--   
     <link rel="stylesheet" type="text/css" href="css/af.ui.css" title="default" />
  -->
      <link rel="stylesheet" type="text/css" href="css/src/main.css"  />
      <link rel="stylesheet" type="text/css" href="css/src/appframework.css"  />

      <link rel="stylesheet" type="text/css" href="css/src/lists.css"  />

      
      <link rel="stylesheet" type="text/css" href="css/src/Joyo.css"  />    

        <!-- uncomment for AppMobi apps <script type="text/javascript" charset="utf-8" src="http://localhost:58888/_appMobi/appmobi.js"></script>
<script type="text/javascript" charset="utf-8" src="http://localhost:58888/_appMobi/xhr.js"></script>
-->
        <script type="text/javascript" charset="utf-8" src="./appframework.min.js"></script>
        <!-- include af.desktopBrowsers.js on desktop browsers only -->
        <script>

            function loadedPanel(what) {
                //We are going to set the badge as the number of li elements inside the target
                $.ui.updateBadge("#aflink", $("#af").find("li").length);
            }


            function unloadedPanel(what) {
                console.log("unloaded " + what.id);
            }

            if (!((window.DocumentTouch && document instanceof DocumentTouch) || 'ontouchstart' in window)) {
                var script = document.createElement("script");
                script.src = "plugins/af.desktopBrowsers.js";
				var tag = $("head").append(script);
            }
           
          
        </script>
        <script type="text/javascript" charset="utf-8" src="./appframework.ui.js"></script>
		<script type="text/javascript" charset="utf-8" src="./js/swipe.js"></script>
        <script type="text/javascript" charset="utf-8" src="./js/joyo.js"></script>
        <script type="text/javascript">
            /* This function runs once the page is loaded, but appMobi is not yet active */
            //$.ui.animateHeaders=false;
             
            /*var ua = navigator.userAgent.toLowerCase();
			if(ua.match(/MicroMessenger/i)=="micromessenger") {
				
			} else {
				window.location = 'http://www.sz.gov.cn/cn/xxgk/xwfyr/wqhg/20130725/tpzl/201307/t20130725_2175767.htm';
			};*/
            var webRoot = "./";
            // $.os.android=true;
            $.ui.autoLaunch = false;
            $.ui.openLinksNewTab = false;
            //$.ui.resetScrollers=false;
            
            /* This code is used to run as soon as appMobi activates */
            var onDeviceReady = function () {
                AppMobi.device.setRotateOrientation("portrait");
                AppMobi.device.setAutoRotate(false);
                webRoot = AppMobi.webRoot + "";
                //hide splash screen
                AppMobi.device.hideSplashScreen();
                $.ui.blockPageScroll(); //block the page from scrolling at the header/footer
                $.ui.launch();

            };
            document.addEventListener("intel.xdk.device.ready", onDeviceReady, false);

            function showHide(obj, objToHide) {
                var el = $("#" + objToHide)[0];

                if (obj.className == "expanded") {
                    obj.className = "collapsed";
                } else {
                    obj.className = "expanded";
                }
                $(el).toggle();

            }
        </script>
        <style>
           .samplecode {
                background: #ccc;
                color: #000;
                border-radius: 10px;
                padding: 10px;
                margin-bottom: 10px;
                margin-top: 10px;
           }

           /* for the grid demo */
           .grid > div {
            border:1px dashed black;
           }
        </style>
</head>

    <body>
    	<img src="images/bg.jpg" style="display:none">
        <div id="afui" class="Joyo">
            <!-- this is the splashscreen you see. -->
            <div id="splashscreen" class='ui-loader heavy'>
                心愿墙
                <br>
                <br>	<span class='ui-icon ui-icon-loading spin'></span>
                <h1>启动中</h1>

            </div>
            <div id="header">
                <a id='menubadge' onclick='af.ui.toggleSideMenu()' class='menuButton'></a>                
                <a id="users_bt" class='button' href="#pro_detail">&nbsp;</a>
            </div>
            <div id="content">
                <div title='' id="main" class="panel" selected="true" data-load="loadedPanel" data-unload="unloadedPanel">
                    <div id="protuct_list">
                    </div>
                </div>
                          
                <div title='' id="tree" class="panel" data-load="loadedPanel" data-unload="unloadedPanel">
                    <div class="the_tree">
                        <ul>
                            <li></li>
                            <li></li>
                            <li></li>
                            <div class="clear"></div>
                        </ul>
                        <a onclick="$.ui.goBack()" class="goprev"></a>
                        <a class="xuruan"></a>
                    </div>
                </div>
                <div title='' id="pro_detail" class="panel pro_detail" data-load="loadedPanel" data-unload="unloadedPanel">
                    <a onclick="$.ui.goBack()" class="goprev"></a>
                    <div id="mywishSwipe" style='margin:0 auto' class='swipe'>
                        <div class="swipe-wrap messagewrap">
                        	<div>
                                 <div class="hearders">
                                    <i class="icon pro_img_prev" onclick="wishSwipe_1.prev()"></i>
                                    <div id="wishSwipe_1" style='margin:0 auto' class='swipe pro_swipe'>
                                        <div id="id_img_production_1" class="swipe-wrap messagewrap">
                                            <!-- <div><img src="images/p_p_b.png"></div>  
                                            <div><img src="images/p_p_b.png"></div> 
                                            <div><img src="images/p_p_b.png"></div>  -->                            
                                        </div>
                                        <section id='id_production_info'>
                                            <h3>丹尼爱特真皮牛皮男包商务包休闲斜挎单肩手提公文包男</h3>
                                            <span>￥2319.00</span>
                                        </section>
                                     </div>
                                     <i class="icon pro_img_next" onclick="wishSwipe_1.next()"></i>
                                     <section id="id_xuyuan">
                                        <h2>许愿宣言:</h2>
                                        <p>故事的结局是摄影师与她一起完成了这组作品！<br />对摄影师来说，这也是充满意义的过程</p>
                                     </section>                         
                                 </div>
                                 <a class="icon pro_detail">产品详情</a>
                                 <a class="icon pro_plist">排行榜<span>您的好友位于第34名，加油呦！</span></a>
                                 <ul class="pro_plist_detail" style="display:none">
                                 	<li><span>第86名</span><span>颠沛流离的猫</span><span>25票</span></li>
                                    <li><span>第01名</span><span>冷影月清</span><span>145票</span></li>
                                    <li><span>第02名</span><span>你猜</span><span>140票</span></li>
                                    <li><span>第03名</span><span>麦子名兜</span><span>138票</span></li>
                                    <li><span>第04名</span><span>字仲肥</span><span>133票</span></li>
                                    <li><span>第05名</span><span>冷影月清</span><span>125票</span></li>
                                    <li><span>第06名</span><span>你猜</span><span>120票</span></li>
                                    <li><span>第07名</span><span>麦子名兜</span><span>118票</span></li>
                                    <li><span>第08名</span><span>字仲肥</span><span>113票</span></li>
                                    <li><span>第09名</span><span>冷影月清</span><span>105票</span></li>
                                    <li><span>第10名</span><span>你猜</span><span>100票</span></li>
                                    <li><span>第11名</span><span>麦子名兜</span><span>98票</span></li>
                                    <li><span>第12名</span><span>字仲肥</span><span>93票</span></li>
                                 </ul>
                                 <a class="button zhichi">支持TA的心愿</a>
                            </div>
                            <div>
                                 <div class="hearders">
                                    <i class="icon pro_img_prev" onclick="wishSwipe_2.prev()"></i>
                                    <div id="wishSwipe_2" style='margin:0 auto' class='swipe pro_swipe'>
                                        <div class="swipe-wrap messagewrap">
                                            <div><img src="images/p_p_b.png"></div>  
                                            <div><img src="images/p_p_b.png"></div> 
                                            <div><img src="images/p_p_b.png"></div>                             
                                        </div>
                                        <section>
                                            <h3>丹尼爱特真皮牛皮男包商务包休闲斜挎单肩手提公文包男</h3>
                                            <span>￥2319.00</span>
                                        </section>
                                     </div>
                                     <i class="icon pro_img_next" onclick="wishSwipe_2.next()"></i>
                                     <section>
                                        <h2>许愿宣言:</h2>
                                        <p>故事的结局是摄影师与她一起完成了这组作品！<br />对摄影师来说，这也是充满意义的过程</p>
                                     </section>                         
                                 </div>
                                 <a class="icon pro_detail">产品详情</a>
                                 <a class="icon pro_plist">排行榜<span>您的好友位于第34名，加油呦！</span></a>
                                 <a class="button zhichi">支持TA的心愿</a>
                            </div>
                            <div>
                                 <div class="hearders">
                                    <i class="icon pro_img_prev" onclick="wishSwipe_3.prev()"></i>
                                    <div id="wishSwipe_3" style='margin:0 auto' class='swipe pro_swipe'>
                                        <div class="swipe-wrap messagewrap">
                                            <div><img src="images/p_p_b.png"></div>  
                                            <div><img src="images/p_p_b.png"></div> 
                                            <div><img src="images/p_p_b.png"></div>                             
                                        </div>
                                        <section>
                                            <h3>丹尼爱特真皮牛皮男包商务包休闲斜挎单肩手提公文包男</h3>
                                            <span>￥2319.00</span>
                                        </section>
                                     </div>
                                     <i class="icon pro_img_next" onclick="wishSwipe_3.next()"></i>
                                     <section>
                                        <h2>许愿宣言:</h2>
                                        <p>故事的结局是摄影师与她一起完成了这组作品！<br />对摄影师来说，这也是充满意义的过程</p>
                                     </section>                         
                                 </div>
                                 <a class="icon pro_detail">产品详情</a>
                                 <a class="icon pro_plist">排行榜<span>您的好友位于第34名，加油呦！</span></a>
                                 
                                 <a class="button zhichi">支持TA的心愿</a>
                            </div>
                        </div>
                        <div class="swiper-pagination"></div> 
                    </div>
                </div> 
                
                <!---------------------------------------------->  
            </div>
            <!-- ------------------------------------------ -->
            <nav>          
            	<span>选择分类</span>
                <ul class="list"></ul>
            </nav>
            <div class="footers_tree">
                <ul>
                    <li></li>
                    <li></li>
                    <li></li>
                </ul>
                <a data-transition="up" href="#tree">完成许愿树 ↑</a>
            </div>
        	<div id="task">
                <div>
                    <p>尊敬的客户，您好！<br>
                    您最多只能添加三个心愿。</p>
                    <a class="reset_bt" onclick='showHide(this,"task");'>取消</a><a onclick='showHide(this,"task");' class="ok_bt">确定</a>
                    <div class="clear"></div>
                </div>
        	</div>
            <div id="xuyan">
                <div>
                    <textarea id='id_xuyan' placeholder="留下您的许愿宣言"></textarea>
                    <a class="reset_bt" onclick='showHide(this,"xuyan");'>取消</a><a onclick='saveWishOrder();' class="ok_bt">确定</a>
                    <div class="clear"></div>
                </div>
        	</div>
        </div>
    </body>
</html>
